<template>
    <div class="risk">
      风险报告
      <el-row class="bgc">
        <el-col :span="24">支付宝</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA active">用户未认证</div>
        </el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">京东</el-col>
      </el-row>
      <el-row>
        <el-col :span="7" :offset="5">
          <el-form :label-position="labelPosition" label-width="100px" :model="formLabelAlign" style="max-width: 460px">
            <el-form-item label="会员昵称:">
              <el-input v-model="formLabelAlign.name" />
            </el-form-item>
            <el-form-item label="白条信用:">
              <el-input v-model="formLabelAlign.region" />
            </el-form-item> </el-form
        ></el-col>
        <el-col :span="7" :offset="3">
          <el-form :label-position="labelPosition" label-width="100px" :model="formLabelAlign" style="max-width: 460px">
            <el-form-item label="会员等级:">
              <el-input v-model="formLabelAlign.type" />
            </el-form-item> </el-form
        ></el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">淘宝</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA active">用户未认证</div>
        </el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">社保</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA active">用户未认证</div>
        </el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">公积金</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA underline">查看公积金信息</div>
        </el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">网银流水</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA underline">查看银行流水信息</div>
        </el-col>
      </el-row>
      <el-row class="bgc">
        <el-col :span="24">人脸识别</el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="mgA">通过</div>
        </el-col>
      </el-row>
    </div>
  </template>
  <script setup>
  const labelPosition = ref("right");
  const formLabelAlign = reactive({
    name: "小小星",
    region: "50000",
    type: "京东钻石",
  });
  </script>
  <style lang="scss" scoped>
  :deep(.el-form-item) {
    margin-bottom: 0;
  }
  :deep(.el-input__wrapper) {
    box-shadow: none;
  }
  .bgc {
    background: #f2f2f2;
    height: 30px;
    line-height: 30px;
    font-size: 16px;
  }
  .mgA {
    width: 100%;
    text-align: center;
    padding: 5px;
    border: 1px solid #e4e4e4;
    margin-bottom: 5px;
    font-size: 16px;
  }
  .underline {
    text-decoration: underline;
  }
  .active{
    color: #cf6652;
  }
  </style>
  